<template>
  <div>
      <h1 id="title" class="myFont">企业考勤管理系统</h1>
      <label>用户名:</label>
      <input type="text" v-model="userInfo.name">
      <br>
      <label>密码:</label>
      <input type="password" v-model="userInfo.pwd">
      <br>
      <button type="button" class="btn-danger" @click="login">登录</button>
      <button type="button" class="btn-danger" @click="loginGet">axios(get)登录</button>
      <button type="button" class="btn-danger" @click="loginPost">axios(post)登录</button>
      <button type="button" class="btn-danger" @click="index">获取不同域的session值</button>
  </div>
</template>

<script>
  /* 局部引入*/
  // import axios from 'axios'
  export default{
        name:"login",
        data(){
          return{
            userInfo:{
                name:"",
                pwd:""
            }
          }
        },
        methods:{
          login(){
            //把vue对象传给变量
            var self = this;
              //ajax请求
              $.ajax({
                  url:"http://localhost:8080/test/login",

                  type:"get",
                  data:this.userInfo,
                  success:function(rs){
                      console.log(rs);
                      if(rs.info=='成功'){
                        //页面跳转到hello页面
                        //第一种方式
                        // self.$router.replace('/hello');//跟业务逻辑相关，安全性高的话用replace不允许回退到上一个页面
                        //第二种方式
                        // self.$router.push('hello');//安全性低

                        //页面跳转到hello页面并且完成传值
                        //第一种方式
                        // self.$router.replace({
                        //   "name":"Hello",
                        //   "query":{
                        //     "userName":self.userInfo.name,
                        //     }
                        //     });
                        self.$router.push({
                          "name":"Hello",
                          "query":{
                            "userName":self.userInfo.name,
                            }
                            });
                      }
                  },
                  error:function(rs){
                    console.log(rs);
                  }

              })
          },
          loginGet(){//axios模块的get请求
            this.$http.get(
                     "/exam/test/loginGet",
                      {params:this.userInfo},
                      ).then(function(rs){//和服务器响应成功的回调函数
                        console.log(rs.data);
                      }).catch(function(rs){
                        console.log(rs.data);
                      })
          },
          loginPost(){//axios模块的post请求
              this.$http.post(
                         "/exam/test/loginPost",
                          this.$qs.stringify(this.userInfo),
                          ).then(function(rs){//和服务器响应成功的回调函数
                            console.log(rs.data);
                          }).catch(function(rs){
                            console.log(rs.data);
                          })
              },
          index(){//axios模块的post请求
              this.$http.post(
                         "/exam/test/index",
                          this.$qs.stringify(this.userInfo),
                          ).then(function(rs){//和服务器响应成功的回调函数
                            console.log(rs.data);
                          }).catch(function(rs){
                            console.log(rs.data);
                          })
              },
          }
}
</script>


<style>
</style>
